<template>
  <div>
    <!-- 输入框 -->
    <header class="header">
      <h1>小黑记事本</h1>
      <input
        @keyup.enter="handlerAdd"
        v-model="todoName"
        placeholder="请输入任务"
        class="new-todo"
      />
      <button @click="handlerAdd" class="add">添加任务</button>
    </header>
  </div>
</template>
<script>
export default {
  name: 'TodoHeader',
  data () {
    return {
      todoName: ''
    }
  },
  created () {
  },
  computed: {
  },
  methods: {
    handlerAdd () {
      this.$emit('handlerAdd', this.todoName)
      this.todoName = ''
    }
  }
}
</script>
<style lang='less'  scoped>
</style>
